<!--
 * @Description: 批量新增待办（导入）
 * @Author: wws1993
 * @Date: 2020-12-11 10:19:54
 * @LastEditTime: 2020-12-14 11:20:28
 * @LastEditors: wws1993
 * @FilePath: \TODO-MANAGER\src\components\BatchImportModule\index.vue
-->

<template>
  <el-dialog title="批量导入" :visible="visible" @close="toggleVisible">
    <code>请以英文符号【;】为分隔符，键入或粘贴待办主题！</code>
    <el-input class="input" type="textarea" v-model="msg" :autosize="{minRows: 3, maxRows: 20}"></el-input>
    <div slot="footer">
      <el-button :type="theme" @click="save">确定</el-button>
    </div>
  </el-dialog>  
</template>

<script lang="ts">
import Vue from 'vue';
import { Component } from 'vue-property-decorator';
import { mapState, mapMutations } from 'vuex';
import lib from '@/lib';

@Component({
  computed: {
    ...mapState({
      theme: (state: any) => state.theme,
      visible: (state: any) => state.BatchImportModule.visible,
    }),
  },
  methods: {
    ...mapMutations({
      toggleVisible: 'BatchImportModule/toggleVisible',
    }),
  },
})
export default class BatchImportModule extends Vue {
  private msg: string = '';

  private save() {
    try {
      const todos = this.msg.split(/[;|；]/);

      if (todos.length === 1 && !todos[0]) {
        lib.notify('tips', '请输入待办主题完成导入');
      } else {
        const runner = (idx = 0) => {
          if (!todos[idx]) {
            return false;
          }

          const t: Date | undefined = new Date();
          const d: Date | undefined = new Date(new Date().setDate(t.getDate() + 1));

          const todo: Manage.Instance  = {
            subject: todos[idx],
            weight: 3,
            content: '',
            startTime: t.format(),
            endTime: d.format(),
            person: [],
            isBatch: true,
          };

          this.$store.dispatch('saveManage', todo).then(() => {
            if (idx < todos.length) {
              runner(idx + 1);
            }
          });
        };

        runner();
      }
    } catch (err) {
      console.log(err);
      // lib.notify('tips', err, 'error');
    }
  }
}
</script>

<style lang="scss" scoped>
code{background:#f44336; color:#fff; padding:3px 15px; border-radius:10px;}
.input{margin-top:5px}
</style>
